import React from 'react'
import { HashRouter as Router, Route, Switch } from 'react-router-dom'
import Main from './main'
import About from './about'
import BookList from './booklist'
import FoodList from './foodlist'
import Topic from './topic'
import Home from './Home'
import NoMatch from './NoMatch'

export default class IRouter extends React.Component{
  render() {
    return (
      <Router>
        <Home>
          <Switch>
            <Route path="/main" render={() => 
              <Main>
                <Route exact={true} path="/main/book/:mainId" component={BookList}></Route>
                <Route path="/main/food" component={FoodList}></Route>
              </Main>
            }></Route>
            <Route path="/about" component={About}></Route>
            <Route path="/topic" component={Topic}></Route>
            <Route component={NoMatch}></Route>
          </Switch>
        </Home>
      </Router>
    )
  }
}